<template>
  <!-- 专题 -->
  <view class="panel hot">
    <view class="item" v-for="item in list" :key="item.subjectId">
      <view class="title">
        <text class="title-text">{{ item.title }}</text>
        <text class="title-desc">{{ item.subjectDescription }}</text>
      </view>
      <navigator
        hover-class="none"
        :url="`/pages/hot/hot?subjectId=${item.subjectId}`"
        class="cards"
      >
        <image :key="item.subjectId" class="image" mode="scaleToFill" :src="item.image"></image>
      </navigator>
    </view>
  </view>
</template>

<script setup lang="ts">
import { defineProps } from 'vue'
import type { Subject } from '@/types/subject'

// 定义 props 接收数据
defineProps<{
  list: Subject[]
}>()
</script>

<style lang="scss">
@import '../styles/subject.scss';
</style>
